@import "header.html"
<link rel="stylesheet" href="../css/cancel_order.css">
<link rel="stylesheet" href="../css/mobileSelect.css">
<style>
    strong {
        color: orangered;
        padding-left: 2px;
    }
</style>

<body>
<main id="main" v-cloak>

    <header class="fxj-header" v-show="chargeRule.menu">
        <a onclick="location.replace('hm_menu.html?houseId='+houseId+'&type=alter');">
            <svg class="icon" aria-hidden="true">
                <use xlink:href="#icon-jiantou"></use>
            </svg>
        </a>
        <h1 class="fxj-title" v-cloak>发布规则</h1>
    </header>

    <header class="fxj-header" @click="chargeRuleType(5)" v-show="chargeRule.footer">
        <a onclick="closeToWin();">
            <svg class="icon" aria-hidden="true">
                <use xlink:href="#icon-jiantou"></use>
            </svg>
        </a>
        <h1 class="fxj-title" v-cloak>发布规则</h1>
    </header>

    <main v-show="chargeRule.main" class="pub_main" v-cloak style="margin-bottom: 2.5rem">
        <div class="mui-content" v-show="chargeRule.menu">
            <ul class="mui-row marrow">
                <li class="mui-table-view-cell groupCell small">
                    <span class="span_left">价格设置</span>
                </li>
                <li class="mui-table-view-cell line-transverse infraCell" @click="chargeRuleType(1)">
                    <span class="span_left">价格设置<strong v-show="!publish_rule.saveMsg.price">*</strong></span>
                    <span class="span_right small">点击查看<svg class="icon"><use xlink:href="#icon-you"></use></svg></span>
                </li>
                <li class="mui-table-view-cell line-transverse infraCell" @click="chargeRuleType(2)">
                    <span class="span_left">押金收取<strong v-show="!publish_rule.saveMsg.pledgeAmount">*</strong></span>
                    <span class="span_right">点击查看<svg class="icon"><use xlink:href="#icon-you"></use></svg></span>
                </li>
                <li class="mui-table-view-cell line-transverse infraCell" @click="chargeRuleType(3)">
                    <span class="span_left">其他费用</span>
                    <span class="span_right">点击查看<svg class="icon"><use xlink:href="#icon-you"></use></svg></span>
                </li>
                <li class="mui-table-view-cell line-transverse infraCell">
                    <span class="span_left">不允许取消订单</span>
                    <div class="mui-switch mui-switch-orange  mui-switch-mini" :class="{'mui-active':canCancelOrder}"
                         onclick="ja.canCancelOrder=!ja.canCancelOrder;">
                        <div class="mui-switch-handle"></div>
                    </div>
                </li>
                <li class="mui-table-view-cell groupCell small">
                    <span class="span_left">交易规则</span>
                </li>
                <li class="mui-table-view-cell infraCell" @click="chargeRuleType(4)">
                    <span class="span_left">退款规则<strong
                            v-show="!publish_rule.saveMsg.cancelPaddingDate||!publish_rule.saveMsg.noUseDate">*</strong></span>
                    <span class="span_right">点击查看<svg class="icon"><use xlink:href="#icon-you"></use></svg></span>
                </li>
                <li class="mui-table-view-cell groupCell small">
                    <span class="span_left">入住须知</span>
                </li>

                <li class="mui-table-view-cell line-transverse infraCell">
                    <span class="span_left">最少入住天数<strong v-show="!publish_rule.saveMsg.min_day">*</strong></span>
                    <span class="span_right span_width" id="least_day" style="color: #f80">未选择</span>
                </li>
                <li class="mui-table-view-cell line-transverse infraCell">
                    <span class="span_left">最多入住天数<strong v-show="!publish_rule.saveMsg.max_day">*</strong></span>
                    <span class="span_right span_width" id="most_day" style="color: #f80">未选择</span>
                </li>
                <li class="mui-table-view-cell line-transverse infraCell">
                    <span class="span_left">是否接待外宾</span>
                    <div class="mui-switch mui-switch-orange  mui-switch-mini "
                         :class="{'mui-active':Number(publish_rule.saveMsg.foreignGuest)===1}" id="forein_goust"
                         @click="is_forein_goust">
                        <div class="mui-switch-handle"></div>
                    </div>
                </li>
                <!--<li class="mui-table-view-cell infraCell">-->
                <!--<span class="span_left">是否提供发票</span>-->
                <!--<div class="mui-switch mui-switch-orange  mui-switch-mini " id="invoice" @click="is_invoice">-->
                <!--<div class="mui-switch-handle"></div>-->
                <!--</div>-->
                <!--</li>-->
                <li class="mui-table-view-cell infraCell">
                    <span class="span_left">房东要求</span>
                    <span class="span_right"></span>
                </li>
                <li class="mui-table-view-cell infraCell" style="height: auto">
                        <textarea type="text" id="ask-for" placeholder="请填写" rows="5"
                                  v-model="publish_rule.saveMsg.require"></textarea>
                </li>
            </ul>
        </div>

        <div class="mui-content" v-show="chargeRule.type1">
            <ul class="mui-row marrow">
                <li class="mui-table-view-cell line-transverse infraCell">
                    <span class="span_left">每日价格<strong v-show="!publish_rule.saveMsg.price">*</strong></span>
                    <span class="span_right">
                        每天 / 元
                    </span>
                </li>
                <li>
                    <input type="number" v-model="publish_rule.saveMsg.price" placeholder="每日价格"
                           style="text-align: right;font-size: 14px"
                           onkeypress="return event.keyCode >= 46 && event.keyCode<= 57;">
                </li>
                <li class="mui-table-view-cell groupCell small">
                    <span class="span_left"></span>
                </li>

                <li class="mui-table-view-cell line-transverse infraCell">
                    <span class="span_left">周末特价</span>
                    <div class="mui-switch mui-switch-orange  mui-switch-mini "
                         :class="{'mui-active':+publish_rule.saveMsg.isDiscountWeekend===1}" id="isDiscountWe"
                         @click="weekendSapecial" onkeypress="return event.keyCode >= 46 && event.keyCode<= 57;">
                        <div class="mui-switch-handle"></div>
                    </div>
                </li>
                <li id="wekendsContainer" class="mui-table-view-cell line-transverse line" v-show="+publish_rule.saveMsg.isDiscountWeekend===1">
                    <span style="font-weight: normal;color: #ff8000" id="wekends">请点击选择</span>
                    <span style="font-weight: normal">每天 / 元</span>
                </li>
                <li class="line" style="justify-content: flex-end" v-show="+publish_rule.saveMsg.isDiscountWeekend===1">
                    <input type="number" style="padding: 10px 15px;text-align: right;font-size: 14px" placeholder="请填写"
                           v-model="publish_rule.saveMsg.discount_price">
                </li>

                <li class="mui-table-view-cell groupCell small">
                    <span class="span_left"></span>
                </li>

                <li class="mui-table-view-cell line-transverse infraCell">
                    <span class="span_left">七天优惠优惠</span>
                    <div class="mui-switch mui-switch-orange  mui-switch-mini"
                         :class="{'mui-active':Number(publish_rule.saveMsg.isDiscountSuccessive7)===1}"
                         id="rent_long_days"
                         @click="ren_long_days">
                        <div class="mui-switch-handle"></div>
                    </div>
                </li>
                <li class="mui-table-view-cell line-transverse infraCell" v-show="Number(publish_rule.saveMsg.isDiscountSuccessive7)===1">
                    <span class="span_left">连续住7天以上</span>
                    <span class="span_right"><span id="day7" style="color: #ff8000">请点击选择</span> 折</span>
                </li>
                <li class="mui-table-view-cell line-transverse infraCell">
                    <span class="span_left">30天优惠</span>
                    <div class="mui-switch mui-switch-orange  mui-switch-mini "
                         :class="{'mui-active':Number(publish_rule.saveMsg.isDiscountSuccessive30)===1}"
                         id="rent_long_days1"
                         @click="ren_long_days1">
                        <div class="mui-switch-handle"></div>
                    </div>
                </li>
                <li class="mui-table-view-cell infraCell" v-show="Number(publish_rule.saveMsg.isDiscountSuccessive30)===1">
                    <span class="span_left">连续住30天以上</span>
                    <span class="span_right"><span id="day30" style="color: #ff8000">请点击选择</span> 折</span>
                </li>

            </ul>
        </div>

        <div class="mui-content" v-show="chargeRule.type2">
            <ul class="mui-row marrow">
                <li class="mui-table-view-cell line">
                    <span class="span_left">在线收取押金<strong v-show="!publish_rule.saveMsg.pledgeAmount">*</strong></span>
                    <span class="span_right"><input type="number" placeholder="请填写"
                                                    v-model="publish_rule.saveMsg.pledgeAmount" onkeyup="checkIpt();"
                                                    onkeypress="return event.keyCode>=48&&event.keyCode<=57;">元</span>
                </li>
                <li class="mui-table-view-cell groupCell small">
                    <span class="span_left"></span>
                </li>

                <li class="textcell">
                    <span class="smallspan">为了保障您和房客双方的权益，请合理收取押金</span>
                    <span class="bigspan">为什么在线收取押金？</span>
                    <span class="smallspan">收取押金是为了保障房东财产安全，在线收取是为了同时保障双方权益，避免产生扣押纠纷。房客支付押金后，由分享家短租平台代为保管。房客退房后若房东没有申请扣押则全款退回给房客；若房东申请扣押且房客同意则将扣除部分打给房东，其余退还房客；若双方在扣押未达成一致时，则由平台介入处理。</span>
                </li>
            </ul>
        </div>


        <div class="textarea_body" v-show="chargeRule.type3">
                <textarea name="" cols="30" rows="10" style="text-align: left" class="textarea textarea_big"
                          placeholder="其他费用
如水费、电费、燃气费、清洁费等您需要单独收取的费用，不填写则默认不收取" v-model="publish_rule.saveMsg.attachment_fare">

             </textarea>
            <br>
            <span class="warn">注：其他费用需要您线下收取，平台不收取</span>
        </div>

        <div class="mui-content" v-show="chargeRule.type4">
            <ul class="mui-row marrow">
                <li class="mui-table-view-cell groupCell big">
                    <span class="span_left">入住前取消订单</span>
                    <br>
                    <span class="small">距离入住当天14:00前，1天=24小时</span>
                </li>

                <li class="mui-table-view-cell line-transverse line">
                    <span class="">房客提前</span>
                    <span class=""><input style="width: 2rem" type="number" placeholder="____"
                                          v-model="publish_rule.saveMsg.cancelPaddingDate" onKeyPress="if (
(event.keyCode<48 || event.keyCode>57)){event.returnValue=false;
}"></span>
                    <span class="span_right">天，取消订单可退还全部押金</span>
                </li>

                <li class="mui-table-view-cell line">
                    <span class="">否则扣除</span>
                    <span class=""><input style="width: 2rem" type="number" placeholder="____"
                                          v-model="publish_rule.saveMsg.noUseDate" onKeyPress="if (
(event.keyCode<48 || event.keyCode>57)){event.returnValue=false;
}"></span>
                    <span class="span_right">天，定金作为违约金支付房东</span>
                </li>

                <li class="mui-table-view-cell groupCell big">
                    <span class="span_left">入住后提前退房</span>
                    <br>
                    <span class="small">入住当天14:00后视为已入住，不可取消订单</span>
                </li>

                <li class="mui-table-view-cell line">
                    <span class="">扣取押金天数为</span>
                    <span class=""><input type="number"
                                          style="width: 5rem;font-size: 14px;font-weight: normal;padding-right: 5px"
                                          placeholder="请填写"
                                          v-model="publish_rule.saveMsg.noUseDate" onKeyPress="if (
(event.keyCode<48 || event.keyCode>57)){event.returnValue=false;
}">天</span>
                </li>
            </ul>
        </div>
    </main>


    <footer class="pub_foot" @click=" send_publish_rull()" v-show="chargeRule.menu">
        <h1 class="fxj-title">完成</h1>
    </footer>


    <footer class="pub_foot" @click="chargeRuleType(5)" v-show="chargeRule.footer">
        <h1 class="fxj-title">完成</h1>
    </footer>


</main>
@import "js.html"
<script src="../script/mobileSelect.js"></script>
<script src="../lib/js/picker.min.js"></script>
<script src="../script/hm_rull.js"></script>
</body>

@import "footer.html"